function Box(classname){
    this.box = document.querySelector('.'+classname)
    this.uls = this.box.querySelectorAll('ul li')
    this.ols = this.box.querySelectorAll('ol li')
    this.index = 0
    this.timerId = null;
    this.auto()
}
Box.prototype.init = function(){
    //鼠标停留
    for(let i=0;i<this.uls.length;i++){
        this.ols[i].onclick =()=>{
            this.index = i;
            this.move
        }
    }
    this.box.onmouseover=()=>{
        clearInterval(this.timerId)
    }
    this.box.onmouseout=()=>{
        this.auto()
    }
}
Box.prototype.auto = function(){
    this.timerId = setInterval(()=>{
        this.rightMove()
    },2000)
}
Box.prototype.move = function(){
    if(this.index === this.uls.length){
        this.index = 0
    }
    if(this.index<0){
        this.index = this.uls.length-1
    }
    for(var i=0;i<this.uls.length;i++){
        this.uls[i].className = this.ols[i].className = '';
    }
    this.uls[this.index].className = this.ols[this.index].className = 'active';
}
Box.prototype.rightMove = function(){
    this.index++;
    this.move()
}
